<template>
  <view class="coupon">
    <!-- 通知 -->
    <view class="notice">
      <uv-notice-bar
        :text="text"
        bgColor="#e5f3f3"
        color="#008c8c"
        mode="link"
      ></uv-notice-bar>
    </view>
    <view class="coupon-content">
      <uv-tabs
        :list="list"
        @click="click"
        :scrollable="false"
        activeStyle="color: #008c8c"
        lineColor="#008c8c"
      ></uv-tabs>
    </view>
    <view class="w-list" v-if="crut == 0">
      <view v-for="item in 2">
        <image
        src="/static/image/yhq.png"
        mode="scaleToFill"
      />
      </view>
     
    </view>
    <view class="y-list" v-if="crut == 1">
      <view v-for="item in 2">
        <image
          src="/static/image/yhq2.png"
          mode="scaleToFill"
        />
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref } from "vue";
const crut = ref(0);
const text = ref("邀请好友赠送优惠券");
const list = ref([
  {
    name: "未使用",
  },
  {
    name: "已使用",
  },
]);
const click = (item) => {
  console.log(item);
  crut.value = item.index;
};
</script>

<style lang="scss">
@import url(./coupon.css);
</style>
